<template>
  <el-form
      label-position="left"
  >
    <el-form-item label="黑广播种类">
      <Select
          @SelectChange="categoryChange"
          :options="broadCategoryOptions"
          :selectValue="broadCategotyNum"
      />
    </el-form-item>
    <el-form-item label="该频点类型">
      <Select
          @SelectChange="typeChange"
          :options="freqCategoryOptions"
          :selectValue="freqNum"
      />
    </el-form-item>
    <el-form-item label="发现地点">
      <el-input
          size="mini"
          style="width: 12vw"
          v-model="address"
          placeholder="请输入发现地点"></el-input>
    </el-form-item>
    <el-form-item label="联系方式">
      <el-input
          size="mini"
          v-model="contact"
          style="width: 12vw"
          placeholder="请输入联系方式"></el-input>
    </el-form-item>
    <el-form-item label="备注">
      <el-input
          size="mini"
          v-model="common"
          style="width: 12vw"
          placeholder="请输入备注"></el-input>
    </el-form-item>
    <el-row style="text-align: center">
      <el-button
          type="primary"
          @click="editBlackBoard"
      >提交
      </el-button>
    </el-row>
  </el-form>
</template>

<script>
// --------------- element-ui ---------------------
import Select from "../../../../../components/element-ui/elSelect"
// --------------- axios ------------------------
import {editBlackBoard} from "../../../../../api/blackboard";

export default {
  components: {Select},
  props: {
    info: {
      type: Object,
      default: () => {
        return {
          address: "",
          category__name: "",
          category__num: "",
          common: "",
          contact: "",
          freq: "",
          freq__num: "",
          id: "",
          lnglat: "",
          mobile__id: "",
          mobile__name: "",
          monitor: "",
          record: "",
          time: "",
        }
      }
    },
    infoAddress: {
      type: String,
      default: ""
    },
  },
  created() {
    this.address = this.info.address;
    this.broadCategotyNum = Number(this.info.category__num);
    this.freqNum = Number(this.info.freq__num);
    this.common = this.info.common;
    this.contact = this.info.contact;
    this.time = this.info.time;
    this.id = this.info.id;
  },
  watch: {
    info: function (val) {
      this.address = val.address;
      this.broadCategotyNum = Number(val.category__num);
      this.freqNum = Number(val.freq__num);
      this.common = val.common;
      this.contact = val.contact;
      this.time = val.time;
      this.id = val.id;
    },
  },
  data() {
    return {
      // ---------- 选项 ---------------
      broadCategoryOptions: [
        {
          value: 1,
          label: "未知"
        },
        {
          value: 2,
          label: "假药"
        }, {
          value: 3,
          label: "虚假信息"
        },
        {
          value: 4,
          label: "政治反动"
        }, {
          value: 5,
          label: "恐怖主义"
        },
        {
          value: 6,
          label: "淫秽色情"
        }
      ],
      freqCategoryOptions: [
          {value: 1, label: "普通频点"},
        {value: 2, label: "区域频点"},
        {value: 3, label: "干扰频点"},
        {value: 4, label: "未知种类"},
        {value: 5, label: "黑广播"}],
      // ----------- 表单 ----------------
      address: "",
      category__name: "",
      broadCategotyNum: 0,
      common: "",
      contact: "",
      freq: "",
      freqNum: 0,
      id: "",
      lnglat: "",
      mobile__id: "",
      mobile__name: "",
      monitor: "",
      record: "",
      time: "",
    }
  },
  methods: {

    /**
     * 修改黑广播
     */
    editBlackBoard: function () {
      let pd = {
        id: this.id,
        category: this.broadCategotyNum,
        address: this.address,
        common: this.common,
        contact: this.contact,
        time: this.time,
        type: this.freqNum
      }
      editBlackBoard(pd)
          .then(res => {
            this.$message(res.data.msg);
            this.$emit("editSucceed")
          })
          .catch(err => {
            console.error(err)
          })
    },

    /**
     * 黑广播种类发生变化
     * @param val
     */
    categoryChange: function (val) {
      this.broadCategotyNum = val;
    },
    /**
     * 频点类型发生变化
     * @param val
     */
    typeChange: function (val) {
      this.freqNum = val
    }
  }
}
</script>

<style scoped>

</style>